
<div class="d-flex justify-content-lg-between align-items-lg-center align-items-end flex-lg-row flex-column w-100">

  <mat-form-field class="w-100 standalone-field custom-size">
    <span
      matPrefix
      class="d-flex flex-nowrap align-items-center justify-content-between me-2">
      <mat-icon>search</mat-icon>
      <span class="text-muted">|</span>
    </span>
    <input
      matInput
      placeholder="Filter ..."
      (input)="applyFilter(input.value)"
      #input
      autocomplete="off">
    <button
      mat-icon-button
      matSuffix
      (click)="removeSearchTerm();input.value = ''"
      *ngIf="input.value!==''">
      <mat-icon>close</mat-icon>
    </button>
  </mat-form-field>

  <div class="p-lg-2"></div>

  <mat-checkbox
    color="primary"
    class="mt-lg-0 mt-3"
    [(ngModel)]="fileSystem"
    matTooltip="Show system files (BE CAREFUL!)"
    (change)="toggleFileSystem();">
    System files
  </mat-checkbox>

</div>